let coalMining = { url: `/api/scdd/scdd_wftjd/getWorkFacetjd` }//储量数据r
let coalHCJD = { url: `/api/scdd/scdd_wftjd/getWorkFacetjd` }
let coalHCXJ1 = { url: `/api/scdd/stopeSeqConfig/queryForPlan` }
var CoalclParams = {
	kjdm:parent.siteDeptid,
	factSatus:'2'
}
var coalhcjdParams = {
	kjdm:parent.siteDeptid,
	factSatus:'2'
}

var coalhcsjParams = {
	mine_id: parent.siteDeptid,
}

let tabIndex = 0
let initFlag
let gzmData
$(function () {
	initData()
	// setInterval(() => {
	// 	initData()
	// }, 5000)
})
function initData () {
	// 储量数据
	initCoalCL()
	// 工作面回采进度数据
	initCoalHCJD()
	// 回采衔接
   initCoalHCXJ()
}

// 工作面信息数据
function initCoalCL () {
	$.ajax({
		type: 'get',
		url: coalMining.url,
		data: CoalclParams,
		headers: {
			Authorization: usertoken
		},
		contentType: 'application/json',
		success: function (res) {
			gzmData = res
			console.log(gzmData, 'gzmData')
			let jlStr = ''
			if ($(".gzmName")) $(".gzmName").remove()
			if ($(".gzmfl")) $(".gzmfl").remove()
			if ($(".coal-box")) $(".coal-box").remove()
			gzmData.map((item, index) => {
				jlStr += `
				<div class="gzmName" data-index="${index}" data-name="${item.faceName}">${item.faceName}</div>
				`
			})

			let defaultStr = `<div class="gzmfl">${jlStr}
			</div>
			<ul class="coal-box" id="default">
			<li class="coal-item" >
				<p class="coal-item-num" id="CQ">${gzmData[tabIndex].districtName || '--'}</p>
				<p class="coal-item-text">采区</p>
			</li>
			<li class="coal-item">
				<p class="coal-item-num" id="MC">${gzmData[tabIndex].layerName || '--'}</p>
				<p class="coal-item-text">煤层</p>
			</li><li class="coal-item">
				<p class="coal-item-num" id="ZXC">${gzmData[tabIndex].coalStrike || '--'}m</p>
				<p class="coal-item-text">走向长</p>
			</li><li class="coal-item">
				<p class="coal-item-num" id="CC">${gzmData[tabIndex].faceTrend || '--'}m</p>
				<p class="coal-item-text">采长</p>
			</li><li class="coal-item">
				<p class="coal-item-num" id="CMGY">${gzmData[tabIndex].miningMethodName || '--'}</p>
				<p class="coal-item-text">采煤工艺</p>
			</li>

			<li class="coal-item">
				<p class="coal-item-num" id="MH">${gzmData[tabIndex].coalPly || '--'}m</p>
				<p class="coal-item-text">煤厚</p>
			</li><li class="coal-item">
				<p class="coal-item-num" id="KCCL">${gzmData[tabIndex].totalReserves || '--'}<text style="font-size:1.2rem">万吨<text></p>
				<p class="coal-item-text">总储量</p>
			</li>
			<li class="coal-item">
				<p class="coal-item-num" id="RZ">${gzmData[tabIndex].volumeWeight || '--'}t/m³</p>
				<p class="coal-item-text">容重</p>
			</li>
			<li class="coal-item">
				<p class="coal-item-num" id="SYCD">${gzmData[tabIndex].syjl || '--'}m</p>
				<p class="coal-item-text">工作面剩余长度</p>
			</li>
		</ul>
			`
			$('.gzm-cont').append(defaultStr)
			$('.gzmfl').map((index, item) => {
				$(item).find('.gzmName').eq(tabIndex).addClass('active-gzmName')
			})
			$('.gzmName').unbind().on('click', function () {
				tabIndex = $(this).index()
				var name = $(this).attr('data-name')
				var pattern = /^\d+/ // 匹配以数字开头的部分
				var matches = name.match(pattern)
				console.log(matches, "33333333333333333")
				if (matches != null) {
					glwd.loadData(matches[0], glwd.zcid)
				} else {
					glwd.docs = []
				}
				//工作面切换同时切换视角
				parent.HTMLProject_JSInvokeCPlusWithCallback1(9, 20, 3, name)
				parent.HTMLProject_JSInvokeCPlusWithCallback1(1, 42, 1, name)
				$(this).parents('.gzmfl').find('.active-gzmName').removeClass('active-gzmName')
				$(this).addClass('active-gzmName')
				if ($(".coal-box")) $(".coal-box").remove()
				let str = `<ul class="coal-box">
				<li class="coal-item">
					<p class="coal-item-num" id="CQ">${gzmData[tabIndex].districtName || '--'}</p>
					<p class="coal-item-text">采区</p>
				</li>
				<li class="coal-item">
					<p class="coal-item-num" id="MC">${gzmData[tabIndex].layerName || '--'}</p>
					<p class="coal-item-text">煤层</p>
				</li><li class="coal-item">
					<p class="coal-item-num" id="ZXC">${gzmData[tabIndex].coalStrike || '--'}m</p>
					<p class="coal-item-text">走向长</p>
				</li><li class="coal-item">
					<p class="coal-item-num" id="CC">${gzmData[tabIndex].faceTrend || '--'}m</p>
					<p class="coal-item-text">采长</p>
				</li><li class="coal-item">
					<p class="coal-item-num" id="CMGY">${gzmData[tabIndex].miningMethodName || '--'}</p>
					<p class="coal-item-text">采煤工艺</p>
				</li>
				<li class="coal-item">
					<p class="coal-item-num" id="MH">${gzmData[tabIndex].coalPly || '--'}m</p>
					<p class="coal-item-text">煤厚</p>
				</li><li class="coal-item">
					<p class="coal-item-num" id="KCCL">${gzmData[tabIndex].totalReserves || '--'}<text style="font-size:1.2rem">万吨<text></p>
					<p class="coal-item-text">总储量</p>
				</li>
				<li class="coal-item">
				<p class="coal-item-num" id="RZ">${gzmData[tabIndex].volumeWeight || '--'}t/m³</p>
				<p class="coal-item-text">容重</p>
			</li>
			<li class="coal-item">
				<p class="coal-item-num" id="SYCD">${gzmData[tabIndex].syjl || '--'}m</p>
				<p class="coal-item-text">工作面剩余长度</p>
			</li>
			</ul>`
				if ($('.coal-box')) {
					$('.coal-box').remove()
				}
				$('.gzm-cont').append(str)
			})
		}
	},

	)
}

// 工作面回采进度
function initCoalHCJD () {
	$.ajax({
		type: 'get',
		url: coalHCJD.url,
		data: coalhcjdParams,
		headers: {
			Authorization: usertoken
		},
		contentType: 'application/json',
		success: function (res) {
			let htmlStr = ""
			$.each(res, (i, v) => {
				let le = i % 2
				let barClassName = ""
				if (i == "0") {
					barClassName = "progress-bar"
				} else {
					barClassName = "progress-bar2"
				}
				let percentNum = ""
				// if (v.ljtjd && v.zxc) {
				// 	percentNum = (parseFloat(v.ljtjd) / parseFloat(v.zxc)) * 100
				// 	percentNum = percentNum.toFixed(2)
				// }
				if(v.for3wWorkFace && v.for3wWorkFace.perc_tjd){
					percentNum=v.for3wWorkFace.perc_tjd
				}else{
					percentNum='--'
				}
				// let number = parseFloat(percentNum.replace('%',''))
				// console.log(number);
				htmlStr += ` <li>
		            <div class="drf-item-jjxx-title">
		                <span class="">${v.for3wWorkFace && v.for3wWorkFace.working_face_name ? v.for3wWorkFace.working_face_name : "--"} </span>
		                <p>
		                    <span>进度：<i class="color1"> ${percentNum || "--"}%</i></span>
		                </p>
		            </div>
		            <div class="drf-progress">
		                <div class = "${barClassName || "--"}" style = "width: ${percentNum || "--"}%">
		                    <div class="animate-bar"></div>
		                     <div class="drf-progress-num">${percentNum || "--"}%</div>
		                </div>
		            </div>
		        </li>`
			})
			$("#CoalHCJD").html(htmlStr)
		}
	})

	// 以上为正确接口写法
	// 下面为测试数据写法
	// let htmlStr = ""
	// let barClassName = "progress-bar2"
	// htmlStr += ` <li>
	// 		<div class="drf-item-jjxx-title">
	// 			<span class="">52607综采工作面</span>
	// 			<p>
	// 				<span>进度：<i class="color1">19%</i></span>
	// 			</p>
	// 		</div>
	// 		<div class="drf-progress ">
	// 			<div class = "${barClassName}" style = "width:19%">
	// 				<div class="animate-bar"></div>
	// 					<div class="drf-progress-num"></div>
	// 			</div>
	// 		</div>
	// 	</li>
	// 	<li>
	// 		<div class="drf-item-jjxx-title">
	// 			<span class="">52508综采工作面</span>
	// 			<p>
	// 				<span>进度：<i class="color1">3%</i></span>
	// 			</p>
	// 		</div>
	// 		<div class="drf-progress ">
	// 			<div class = "progress-bar" style = "width:3%">
	// 				<div class="animate-bar"></div>
	// 					<div class="drf-progress-num"></div>
	// 			</div>
	// 		</div>
	// 	</li>

	// 	`
	// $("#CoalHCJD").html(htmlStr)
	// 上面为测试数据写法

}
// 工作面回采衔接
function getFaceNameById(id) {
	return new Promise((resolve) => {
			$.ajax({
					type: 'get',
					url: `/api/coal/coal-face/view?id=${id}`,
         headers: {
    			Authorization: usertoken
    		},
					success: function(res) {
							resolve(res && res ? res.faceName : '-');
					},
					error: function() {
							resolve('--');
					}
			});
	});
}

function initCoalHCXJ() {
	$.ajax({
		type: 'get',
		url: coalHCXJ1.url, // 或者你的接口地址
		data: coalhcsjParams,
		headers: {
			Authorization: usertoken
		},
		contentType: 'application/json',
		success: async function(data) {
			let list = data.list || [];
			// 批量查faceName
			let results = await Promise.all(list.map(async item => {
					let faceName = await getFaceNameById(item.id_at_working_face);
					return { ...item, faceName };
			}));

			// 分组渲染（按队伍名分组）
			let groupMap = {};
			results.forEach(item => {
					if (!groupMap[item.v_task_name]) groupMap[item.v_task_name] = [];
					groupMap[item.v_task_name].push(item);
			});

			let htmlStr = '';
			Object.keys(groupMap).forEach(teamName => {
					let group = groupMap[teamName];
					// 找回采和衔接
					let current = group.find(i => i.v_kczt === '回采工作面');
					let next = group.find(i => i.v_kczt === '衔接工作面');
					htmlStr += `
							<li>
									<div class="huiCai-name"><img src="img/icon.png" alt="">${teamName.replace('接续','')}</div>
									<div class="huicai-con">
											<div class="huiCai">
													<div class="huiCai-one-bg">${current ? current.faceName : '--'}</div>
													<div class="jiantou red"><img src="img/jiantou.png" alt=""></div>
													<dl>
															<dt>结束时间</dt>
															<dd>${current ? current.v_kcrqz : '--'}</dd>
													</dl>
											</div>
											<div class="huiCai">
													<div class="huiCai-two-bg">${next ? next.faceName : '--'}</div>
													<dl>
															<dt>投产时间</dt>
															<dd>${next ? next.v_kcrqq : '--'}</dd>
													</dl>
											</div>
									</div>
							</li>
					`;
			});
			$("#CoalHCXJ").html(htmlStr)
		}
	});
		// 以上为正确接口写法
	// 下面为测试数据写法
	// let htmlStr = ""

	// htmlStr += ` <li>
  //                       <div class="huiCai-name"><img src="img/icon.png" alt="" srcset="">
  //                          综采一队</div>
  //                       <div class="huicai-con">
  //                           <div class="huiCai">
  //                               <div class="huiCai-one-bg">52607综采工作面</div>
  //                               <div class="jiantou red"><img src="img/jiantou.png" alt=""></div>
  //                               <dl>
  //                                   <dt>结束时间</dt>
  //                                   <dd>2024-09-12</dd>
  //                               </dl>
  //                           </div>
  //                           <div class="huiCai">
  //                               <div class="huiCai-two-bg">52608综采工作面</div>
  //                               <dl>
  //                                   <dt>投产时间</dt>
  //                                   <dd>2024-09-14</dd>
  //                               </dl>
  //                           </div>
  //                       </div>
  //                   </li>
	// 				<li>
	// 				<div class="huiCai-name"><img src="img/icon.png" alt="" srcset="">
	// 				   综采五队</div>
	// 				<div class="huicai-con">
	// 					<div class="huiCai" style="width:25%;">
	// 						<div class="huiCai-one-bg">52508</div>
	// 						<div class="huiCai-one-bg">综采面</div>
	// 						<div class="jiantou red" style="left: 104%;"><img src="img/jiantou.png" alt=""></div>
	// 						<dl>
	// 							<dt>结束时间</dt>
	// 							<dd>2024-11-20</dd>
	// 						</dl>
	// 					</div>
	// 					<div class="huiCai" style="width:25%;">
	// 						<div class="huiCai-two-bg">52509</div>
	// 						<div class="huiCai-two-bg">综采面</div>
	// 						<div class="jiantou red" style="left: 104%;"><img src="img/jiantou.png" alt=""></div>
	// 						<dl>
	// 							<dt>投产时间</dt>
	// 							<dd>2024-11-20</dd>
	// 						</dl>
	// 					</div>
	// 					</div>
	// 				</div>
	// 			</li>`
	// $("#CoalHCXJ").html(htmlStr)

	// 上面为测试数据写法
}

